<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}">
    <link rel="stylesheet" th:href="@{/css/scroll.css}">
    <style>
        .download-table {
            width: 100%;
        }

        tr.download-table-row {
            font-size: 20px;
            line-height: 50px;
            border-bottom: 1px dashed darkgray;
        }

        .download-table-k {
            width: 80%;
        }

        .download-table-v {
            width: 20%;
            text-align: center;
        }

        .download-table-v a:hover {
            text-decoration: underline;
        }
    </style>


</head>
<body>
<div class="layui-fluid">
    <nav style="margin: 10px 0; padding-bottom:5px;border-bottom: 1px dashed darkgray;">
    <span class="layui-breadcrumb">
        <a th:href="@{/admin/home}">首页</a>
        <a>下载专区</a>
        <a>
            <cite>技术资料</cite>
        </a>
    </span>
    </nav>
    <div>
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
            <legend>技术资料下载</legend>
        </fieldset>

        <div class="layui-tab">
            <ul class="layui-tab-title">
                <li class="layui-this">学习资料</li>
                <li>软件下载</li>
                <li>更多···</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <table class="download-table">

                    </table>
                </div>
                <div class="layui-tab-item">
                    <div><a href="https://www.bootcdn.cn/" target="_blank">https://www.bootcdn.cn/</a></div>
                </div>
                <div class="layui-tab-item">敬请期待···</div>
            </div>
        </div>
    </div>

</div>
<script th:src="@{/js/jquery-3.4.1.js}"></script>
<script th:src="@{/layui/layui.js}"></script>
<script th:src="@{/layui/lay/modules/element.js}"></script>
<script type="text/javascript" th:inline="javascript">
    var $tb = $(".download-table");
    var dataHtml = "";
    $.post("../../admin/download/file/list", {}, function (resp) {
        console.log(resp.data)
        resp.data.forEach(function (data) {
            dataHtml += `
            <tr class="download-table-row">
                            <td class="download-table-k">${data.fileName}</td>
                            <td class="download-table-v">
                                <a href="../../admin/downloadFileById/${data.id}">download</a>
                            </td>
                        </tr>
            `
        });
        $tb.append(dataHtml);
    });
</script>
</body>
</html>